<template>
	<div class="factory-info">
		<head-back-title title="审核详情"></head-back-title>
		<el-card>
			<el-form :model="infoForm" :rules="infoFormRules" ref="infoForm" label-width="120px">
				<div class="content-info">
					<el-form-item label="品牌名称:" prop="factory_name">
						<el-input v-model="infoForm.factory_name" placeholder="请输入品牌名称" clearable></el-input>
					</el-form-item>
					<el-form-item label="企业名称:" prop="name"><el-input v-model="infoForm.name" placeholder="请输入企业名称" clearable></el-input></el-form-item>
					<el-form-item label="风格:" prop="factory_style_sn"><el-input v-model="infoForm.factory_style_sn" placeholder="请输入风格" clearable><i slot="suffix">多风格用英文,(逗号)隔开</i></el-input></el-form-item>
					<el-form-item label="联系人:" prop="contacts_name"><el-input v-model="infoForm.contacts_name" placeholder="请输入联系人" clearable></el-input></el-form-item>
					<el-form-item label="联系电话:" prop="phone"><el-input v-model="infoForm.phone" placeholder="请输入联系电话" clearable></el-input></el-form-item>
					<el-form-item label="详细地址:" prop="address"><el-input v-model="infoForm.address" placeholder="请输入详细地址" clearable></el-input></el-form-item>
					<el-form-item label="公司介绍:" prop="brief"><el-input v-model="infoForm.brief" placeholder="请输入公司介绍"  type="textarea"
  :autosize="{ minRows: 2, maxRows: 5}"></el-input></el-form-item>
					<el-form-item label="企业logo:" class="upload-box" prop="logo">
						<div class="factory-img-upload">
							<div class="factory-img-upload-btns">
								<el-upload
									ref="upload"
									action="fakeaction"
									:show-file-list="false"
									:http-request="function(res) {return upload(res, 1);}">
									<el-button type="primary" size="small">企业logo</el-button>
								</el-upload>
								<div class="el-upload__tip">小于500KB</div>
							</div>
							<div class="factory-img-upload-imgs">
								<el-image :src="infoForm.logo"><div slot="error"></div></el-image>
							</div>
						</div>
					</el-form-item>
					<el-form-item label="企业图片:" class="upload-box" prop="backgroud_img">
						<div class="factory-img-upload">
							<div class="factory-img-upload-btns">
								<el-upload
									ref="upload"
									action="fakeaction"
									:show-file-list="false"
									:http-request="function(res) {return upload(res, 2);}">
									<el-button type="primary" size="small">企业图片</el-button>
								</el-upload>
								<div class="el-upload__tip">小于500KB</div>
							</div>
							<div class="factory-img-upload-imgs">
								<el-image :src="infoForm.backgroud_img"><div slot="error"></div></el-image>
							</div>
						</div>
					</el-form-item>
					<el-form-item label="分类图片:" class="upload-box" prop="category_img">
						<div class="factory-img-upload">
							<div class="factory-img-upload-btns">
								<el-upload
									ref="upload"
									action="fakeaction"
									:show-file-list="false"
									:http-request="function(res) {return upload(res, 3);}">
									<el-button type="primary" size="small">分类图片</el-button>
								</el-upload>
								<div class="el-upload__tip">小于500KB</div>
							</div>
							<div class="factory-img-upload-imgs">
								<el-image :src="infoForm.category_img"><div slot="error"></div></el-image>
							</div>
						</div>
					</el-form-item>
					<div style="margin-top: 30px;" v-if="infoForm.examine_status == 0">
						<el-button type="primary" @click="operate(0)" style="margin-left: 100px;">审核</el-button>
						<el-button type="danger" @click="operate(1)" style="margin-left: 40px;">拒绝</el-button>
					</div>
				</div>
			</el-form>
		</el-card>
		<!-- 拒绝原因弹框 -->
		<el-dialog title="拒绝原因" :visible.sync="remarksDialog" center :modal-append-to-body="false" width="680px">
			<el-form :model="remarksForm" :rules="remarksFormRules" ref="remarksForm" label-width="120px">
				<el-form-item label="拒绝原因:" prop="reason">
					<el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="remarksForm.reason"></el-input>
				</el-form-item>
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button @click="remarksDialog = false">取 消</el-button>
				<el-button type="primary" @click="confirmClick('remarksForm')">确 定</el-button>
			</span>
		</el-dialog> </div>
	</div>
</template>

<script>
export default {
	components: {},
	data() {
		return {
			cityJson: '',
			cityList: '',
			areaList: '',
			factoryInfo: '',
			infoForm: {
				name: '',
				factory_name: '',
				contacts_name: '',
				phone: '',
				address: '',
				brief: '',
				logo: '',
				backgroud_img: '',
				factory_style_sn:'',
				category_img:''
			},
			// 校对规则
			infoFormRules: {

			},
			remarksDialog: false,
			remarksForm: {
				reason: ''
			},
			remarksFormRules: {
				reason: [{ required: true, message: '请输入内容' }]
			},
		};
	},
	methods: {
		// 初始化列表
		init() {
			let data = {
				id: this.$route.query.id,
			};
			
			this.$http(this.$ApiList.ExamineInfo, data).then(res => {
				this.infoForm = res.datas
			});
		},
		// 图片上传
		upload(params,type) {
			const file = params.file,
				isJPGPNG = file.type === 'image/jpeg' || 'image/png',
				isLt500KB = file.size / 1024 <= 500;
			if (!isJPGPNG) {
				this.$message.error("只能上传图片格式png、jpg!");
				return;
			}
			if (!isLt500KB) {
				this.$message.error("图片不能大于500K!");
				return;
			}
			const form = new FormData();
			form.append("file[]", file);
		
			switch (Number(type)){
				case 1:
					this.$http(this.$ApiList.publicUpload,form).then(res => {
							this.infoForm.logo = res.datas[0];
					})
					break;
				case 2:
				this.$http(this.$ApiList.publicUpload,form).then(res => {
						this.infoForm.backgroud_img = res.datas[0];
				})
					break;
					case 3:
					this.$http(this.$ApiList.publicUpload,form).then(res => {
							this.infoForm.category_img = res.datas[0];
					})
						break;
					
			}
		},
		// 0 审核 1 拒绝
		operate(type) {
			let data = {
				examine_id: this.infoForm.examine_id
			};
			switch (type) {
				case 0:
					this.$http(this.$ApiList.ExamineSuccess, data).then(res => {
							this.$layer.msg('操作成功');
							setTimeout(()=>{
								this.goBack()
							},1000)
					});
					break;
				case 1:
				this.remarksDialog = true
				this.remarksForm.examine_id = this.infoForm.examine_id
					break;
			}
		},
		//提交
		confirmClick(formName) {
			this.$refs[formName].validate(valid => {
				if (valid) {
					this.$http(this.$ApiList.ExamineRefuse, this.remarksForm).then(res => {
							this.$layer.msg('操作成功');
							this.remarksDialog = false
							this.init()
							setTimeout(()=>{
								this.goBack()
							},1000)
					});
				} else {
					this.$layer.msg('请填写完整信息后提交');
				}
			});
		},
		// 返回
		goBack() {
			this.$router.go(-1);
		},
	},
	created() {
		this.init();
	}
};
</script>

<style>
.content-info {
	width: 700px;
}
.factory-info .upload-box .factory-img-upload {
	display: flex;
}
.factory-info .upload-box .factory-img-upload .factory-img-upload-imgs .el-image {
	width: 140px;
	height: 140px;
	border: solid 1px #e5e5e5;
	margin-left: 25px;
	vertical-align: top;
}
</style>
